<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>js示例4-12-10</title>
	<script>
	window.onload = function() {
	    d1 = document.getElementById("d1");
	    d2 = document.getElementById("d2");
	    btn1 = document.getElementById("btn1");
	    d1.addEventListener("click", function(event) {
	      alert("d1响应")
	     }, true);
	     d2.addEventListener("click", function(event) {
	       alert("d2响应")
	     }, true);
	     btn1.addEventListener("click", function(event) {
	         alert("按钮响应")
	      }, true);
	   }
		
	</script>
</head>
<body>
	<div id="d1" style="background:#a7a7f1;width:400px;height:200px;">
    	<div id="d2" style="background:#00ff00;width:300px;height:130px;">
    		<input type="button" id="btn1" value="冒泡测试" style="background:rgb(207,195,195);font-size:26pt;padding:5px;">
    	</div>
	</div>
</body>
</html>